<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>选择试卷</title>
<%@include file="../core/head.jsp"%>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" href="${ctx }/css/core.css" type="text/css">
<link rel="stylesheet" href="${ctx }/css/exam.css" type="text/css">
<link rel="stylesheet" href="${ctx}/css/buttons.css" type="text/css">
<link rel="stylesheet" href="${ctx}/css/table.css" type="text/css">
<script type="text/javascript" src="${ctx}/js/modules/code/AjaxAuthFilter.js"></script>
<link rel="stylesheet" href="${ctx}/js/jquery-ui-1.10.3/css/ui-lightness/jquery-ui-1.10.3.custom.css" type="text/css">
<script type="text/javascript" src="${ctx }/js/jquery-ui-1.10.3/js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript" src="${ctx }/js/modules/code/MessageBox.js"></script>
<style type="text/css">
#unfinDialog {
	text-align: center;
}

#unfinDialog table {
	font-size: 12px;
	text-align: left;
	margin: auto;
}

#unfinDialog table td {
	padding: 2px;
}

#unfinDialog div {
	margin: 5px;
}
#unfinDialog input {
	margin-right: 5px;
}
#unfinDialog_table th{
	
	white-space: nowrap;
}
</style>

<script type="text/javascript">
	function changeSubMebu() {

	}

	function startExamination() {
		var select = $("#paperSelect");
		var paperId = select.val();
		var continueExam = $("#continueExam");
		continueExam.val(false);

		$.ajax({
			dataType : "json",
			cache : true,
			type : "POST",
			url : "${ctx}/exam/getLastExamination.action",
			data : {
				"examination.paper.id" : paperId
			},
			error : function(request) {

				$.MessageBox.info("服务器连接异常");

			},
			success : function(data) {
				if (data) {
					var pass = $.AjaxAuthFilter.checkSession("${ctx}/user/ajaxLogin.action", data);

					if (pass) {
						continueExam.val(true);
						var diaobj = $("#unfinDialog");
						var done = data.correntCount+data.wrongCount;
						var rema = data.questionCount-done;
						diaobj.find(".ename").text(data.title);
						diaobj.find(".etime").text(data.lastAnswerDate);
						diaobj.find(".edone").text(done);
						diaobj.find(".erema").text(rema);
						diaobj.dialog("open");
					}
				}else{
					$("#mainForm").submit();
				}
			}
		});

	}

	$(function() {
		$.AjaxAuthFilter.init("${user.id}",{logined:updateUser,diff:function(user){
			$.MessageBox.info("登录用户不同，自动刷新页面！",{callback:function(){
				window.location.href="${ctx}/exam/startExam.action";
			}});
		}});
		
		$("#unfinDialog").dialog({
			autoOpen : false,
			modal : true,
			show : {
				effect : "blind",
				duration : 1000
			},
			hide : {
				effect : "explode",
				duration : 1000
			},
			buttons : {
				"开始答题" : function() {
					var boo = $(this).find("input:checked").size() > 0;
					$("#continueExam").val(boo);
					$("#mainForm").submit();
					$(this).dialog("close");
				},
				"取消" : function() {
					$(this).dialog("close");
				}
			}
		});

	});
</script>
</head>

<body>
	<%@include file="top.jsp"%>
	<div class="width center menuPanel radius">
		<div class="context center">
			<form action="${ctx }/exam/startExam.action" id="mainForm" method="post">
				<div style="margin-top: 80px;" align="center">
					<input id="continueExam" type="hidden" name="continueExam" value="true" />
					<table class="table">
						<tr>
							<th>考试类型：</th>
							<td>
							<select id="type" name="examination.type" onchange="changeSubMebu()">
									<z:dic code="" isType="true" init="true" />
							</select>
							</td>
						</tr>
						<tr>
							<th>选择试题：</th>
							<td>
								<select id="paperSelect" name="examination.paper.id">
										<c:forEach var="p" items="${papers}">
											<option value="${p.id}">${p.title }</option>
										</c:forEach>
	
								</select>
							</td>
						</tr>
						<tr>
							<th></th>
							<td style="text-align: center;"><input class="button blue menuBut" type="button" onclick="startExamination()" value="开始答题" /></td>
						</tr>
					</table>
					<c:if test="${user.fromMobile}">
						<div style="color:red;width: 80%;text-align: left;">提示：由于试题量巨大，移动终端用户可以在Wifi环境下，先将试题加载完成，然后再作答，以节省流量！</div>
					</c:if>
				</div>


			</form>
		</div>
	</div>

	<div id="unfinDialog" title="是否继续上次答题">

		<table border="0" id="unfinDialog_table">
			<tr>
				<th>试题名称:</th>
				<td><span class="ename"></span></td>
			</tr>
			<tr>
				<th>已答题数:</th>
				<td><span class="edone">XXX</span></td>
			</tr>
			<tr>
				<th>剩余题数:</th>
				<td><span class="erema">XXX</span></td>
			</tr>
			<tr>
				<th>最后答题时间:</th>
				<td><span class="etime">XXX</span></td>
			</tr>
		</table>

		<div>
			<label><input type="checkbox" checked="checked" />继续上次答题</label>
		</div>

	</div>


	<%@include file="../core/bottom.jsp"%>
</body>
</html>
